/*
*@description: 元数据文件查看详情
*@author: 作者
*@date: 2023-03-05 14:04:45
*@email: 邮箱
*/

<!--  -->
<template>
    <div class=''>
        <el-card shadow="always" :body-style="{ padding: '20px' }">
            <div slot="header">
                <span>{{parentInfo.name}}详情</span>
                <el-button style="float: right; padding: 3px 0" @click="()=>{$router.go(-1)}" type="text">返回</el-button>
            </div>
            <div>
                <div class="demo-image">
                    <el-image lazy style="width:224px;height:224px;margin-left:15px;margin-bottom:15px;" v-for="(item,index) in srcList" :key="index" :src="item" :preview-src-list="srcList" />
                </div>
            </div>
        </el-card>
    </div>
</template>

<script>
    export default {
        components: {},
        data() {
            return {
                parentInfo: this.$route.query, //获取路由传参数据
                srcList: [], //图片数据
            };
        },
        computed: {},
        created() {
            this.changeData()
        },
        methods: {
            //修改数据
            changeData() {
                //判断是那个文件类型进入的 然后替换对应的文件类型下的数据
                if (this.$route.query.id == 1) {
                    this.srcList = [
                        require('../../assets/img/1.png'),
                        require('../../assets/img/2.png'),
                        require('../../assets/img/3.png'),
                        require('../../assets/img/4.png'),
                    ]
                } else if (this.$route.query.id == 2) {
                    this.srcList = [
                        require('../../assets/img/pic.jpg'),
                    ]
                }
            }
        },
    }
</script>
<style scoped>
    .demo-image {
        display: flex;
        flex-wrap: wrap;
    }
</style>
